import { TabBar } from 'antd-mobile';
import React from 'react'
// import { Route, Switch } from 'react-router-dom'
import { withRouter } from 'react-router-dom'
// import style from './demo2.module.css'
// import Home from '../../../pages/Home/index'
// import LIstFound from '../../../pages/LIstFound'
// import My from '../../../pages/My'
// import NotFound from '../../../pages/404/NotFound'
 class TabBarExample extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedTab: 'redTab',
      hidden: false,
      fullScreen: false,
    };
  }



  render() {
    return (
      <div className="style.demo-tabbar-wrap">
         <div className="style.demo-tabbar-2">
         <TabBar
          unselectedTintColor="#949494"
          tintColor="#33A3F4"
          barTintColor="white"
          hidden={this.state.hidden}
        >
          <TabBar.Item
          activeClassName="style.active-tab"
            title="Life"
            key="Life"
            icon={<div style={{
              width: '22px',
              height: '22px',
              background: 'url(https://zos.alipayobjects.com/rmsportal/sifuoDUQdAFKAVcFGROC.svg) center center /  21px 21px no-repeat' }}
            />
            }
            selectedIcon={<div style={{
              width: '22px',
              height: '22px',
              background: 'url(https://zos.alipayobjects.com/rmsportal/iSrlOTqrKddqbOmlvUfq.svg) center center /  21px 21px no-repeat' }}
            />
            }
            selected={this.state.selectedTab === 'blueTab'}
            badge={1}
            onPress={() => {
              this.setState({
                selectedTab: 'blueTab',
              });
            }}
            data-seed="logId"
          >

          </TabBar.Item>
          <TabBar.Item
            icon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url(https://gw.alipayobjects.com/zos/rmsportal/BTSsmHkPsQSPTktcXyTV.svg) center center /  21px 21px no-repeat' }}
              />
            }
            selectedIcon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url(https://gw.alipayobjects.com/zos/rmsportal/ekLecvKBnRazVLXbWOnE.svg) center center /  21px 21px no-repeat' }}
              />
            }
            title="Koubei"
            key="Koubei"
            badge={'new'}
            selected={this.state.selectedTab === 'redTab'}
            onPress={() => {
              this.setState({
                selectedTab: 'redTab',
              });
            }}
            data-seed="logId1"
          >
      
          </TabBar.Item>
        </TabBar>
         </div>

      </div>
    );
  }

}
// 包装一下 TabBarExample，让它拥有路由属性
export default withRouter(TabBarExample)
// 包装一下 TabBarExample，让它拥有路由属性
// export default withRouter(TabBarExample)
// ReactDOM.render(<TabBarExample />, mountNode)